<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>Stack's Carousel Demo</title>
	<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.4.1/build/reset-fonts-grids/reset-fonts-grids.css" />
	<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.4.1/build/base/base-min.css" />
	<link rel="stylesheet" href="../stacks-carousel.css" type="text/css" />
	<style type="text/css">
		body {
			text-align: left;
			padding: 1em;
		}
	</style>
	<script type="text/javascript" src="http://yui.yahooapis.com/2.4.1/build/yahoo-dom-event/yahoo-dom-event.js"></script> 
	<script type="text/javascript" src="http://yui.yahooapis.com/2.4.1/build/element/element-beta-min.js"></script>
	<script type="text/javascript" src="http://yui.yahooapis.com/2.4.1/build/animation/animation-min.js"></script>
	<script type="text/javascript" src="../stacks-carousel.js"></script>
	<script type="text/javascript">
		YAHOO.util.Event.onDOMReady(function() {
			var carousel = new YAHOO.Stack.Carousel('carousel');
		});
	</script>
</head>
<body>
	
	<h1>Stack's Carousel Demo</h1>
	
	<p>
		<em>
			The
			<span xmlns:dc="http://purl.org/dc/elements/1.1/" href="http://purl.org/dc/dcmitype/StillImage" rel="dc:type">images</span> below are licensed under a 
			<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/us/">Creative Commons Attribution-Noncommercial-Share Alike 3.0 United States License</a>.
		</em>
	</p>
	
	<div id="carousel">
		<ul>
			<li><img src="1.jpg" width="" /></li>
			<li><img src="2.jpg" width="" /></li>
			<li><img src="3.jpg" width="" /></li>
			<li><img src="4.jpg" width="" /></li>
			<li><img src="5.jpg" width="" /></li>
			<li><img src="6.jpg" width="" /></li>
			<li><img src="7.jpg" width="" /></li>
			<li><img src="8.jpg" width="" /></li>
			<li><img src="9.jpg" width="" /></li>
			<li><img src="10.jpg" width="" /></li>
		</ul>
	</div>
	
	<p>
		<button id="prev">&lt;&lt;</button>
		<button id="next">&gt;&gt;</button>
	</p>

</body>
</html>
